<template>
	<view>
		<view class="coreshop-padding-10 coreshop-margin-10 coreshop-bg-white coreshop-border-radius-trbl-18">
			<view
				class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-between coreshop-min-height-30">
				<view class="coreshop-font-16 coreshop-text-black coreshop-font-weight-bold coreshop-flex coreshop-align-center">
					<view class="dot dot__red c-m-r-10"></view>
					<text>精选项目</text>
				</view>
				<u-icon name="arrow-right-double" size="12" label="更多" labelSize="12" labelPos="left" @click="$u.route('/pages/cardbuy/list/list')" />
			</view>
			<view class="c-m-t-10 coreshop-solid-top">
				<u-list :height="345 * coreshopData.parameters.list.length + 'rpx'">
					<u-list-item v-for="(item, key) in coreshopData.parameters.list" :key="key">
						<image 
							class="img"
							v-if="item.shareImageUrl"
							:src="item.shareImageUrl" 
							style="width: 100%; height: 325rpx;"
							@click="$u.route('/pages/cardbuy/cardbuyDetails/cardbuyDetails',{id: item.id, type: 1})">
						</image>
						<view 
							v-else
							class="card-list-item"
							:style="{background:item.bgColor}"
							:key="key"
							@click="$u.route('/pages/cardbuy/cardbuyDetails/cardbuyDetails',{id: item.id, type: 1})">
							<view class="tx">
								<view class="name">{{item.name}}</view>
								<view class="coreshop-font-xs">含{{item.projectCount}}种项目</view>
								<view class="c-m-t-30">
									<text class="coreshop-font-xs">￥</text>
									<text>{{item.salePrice}}</text>
								</view>
							</view>
						</view>
					</u-list-item>
				</u-list>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: { coreshopData: { required: true, } },
		data() {
			return {}
		},
		created() {
			console.log('sdas', this.coreshopData)
		}
	}
</script>

<style lang="scss" scoped>
	.img{
		margin-bottom: 20rpx;
		border-radius: 0 0 24rpx 0;
	}
	.card-list-item {
		width: 100%;
		margin: auto;
		margin-bottom: 20rpx;
		padding: 30rpx 20rpx;
		border-radius: 10rpx;
		height: 325rpx;
		background-color: #323434;
		// background-image: url('../../static/images/my/card.png');
		background-size: 50% 50%;
		background-repeat: no-repeat;
		background-position: center left;
		position: relative;

		.tx {
			color: #fff;
			line-height: 1.4;
		}
	}
</style>
